<!DOCTYPE html>
<html lang="en">

<head>
    <title>挑战记录</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <script src="../../js/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" href="../../css/public.css">
    <style>
        .register_bg {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            right: 0;
            background: url('../../images/reg/bg.png') center no-repeat;
            background-size: 100%;
            z-index: 1;
        }

        .home_zhangdui_nav {
            overflow: hidden;
            background: #021349 url('../../images/reg/back.png') 10px center no-repeat;
            background-size: .7rem;
        }

        .record {
            margin-top: 60px;
            width: 100%;
            background: #040d3c;
            padding-bottom: 1%;
        }

        .record ul {
            width: 100%;
        }

        .record ul li {
            width: 90%;
            margin: 0 auto;
            background: #1B1D5D;
            height: 67px;
            padding-top: 8.5px;
            padding-left: 2.5%;
            box-sizing: border-box;
            margin-bottom: 10px;
            position: relative;
        }

        .headpiece {
            width: 100%;
            height: 30px;
            line-height: 20px;
        }

        .roomNumber {
            float: left;
            color: #7E85C2;
            font-size: .3rem;
        }

        .number {
            float: left;
            color: #BFC1F2;
            font-size: 0.4rem;
        }

        .fighting_sum {
            float: right;
            padding-right: 10.5%;
            color: #ff4343;
            font-size: .4rem;
            display: inline-block;
            width: 20%;
            overflow: hidden;
            text-overflow: ellipsis;
            height: 20px;
        }

        .fighting_species {
            position: absolute;
            right: 2%;
            color: #ff4343;
            font-size: .4rem;
        }

        .lost_species {
            position: absolute;
            right: 2%;
            color: #2FAFFF;
            font-size: .4rem;
        }

        .victor_species {
            position: absolute;
            right: 2%;
            color: #FFCD29;
            font-size: .4rem;
        }

        .lost_sum {
            float: right;

            color: #2FAFFF;
            font-size: .4rem;
            display: inline-block;
            margin-right: 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            height: 20px;
            height: 20px;

            height: 25px;

            margin-top: -5px;
            display: inline-block;

            background-size: 0.5rem
        }

        .victor_sum {
            float: right;

            color: #FFCD29;
            font-size: .4rem;
            display: inline-block;
            margin-right: 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            height: 20px;
            height: 20px;

            height: 25px;

            margin-top: -5px;
            display: inline-block;

            background-size: 0.5rem
        }

        .icon_circle_fighting {
            width: 25px;
            height: 25px;
            float: left;
            margin-left: 35%;
            margin-top: -5px;
            display: inline-block;
            background: url(../../images/home/icon_circle_fighting.png) center center no-repeat;
            background-size: 0.5rem;
        }



        .underpart {
            width: 100%;
            line-height: 20px;
        }

        .bottomPour {
            float: left;
            color: #7E85C2;
            font-size: .3rem;
        }

        .BetAmount {
            float: left;
            color: #BFC1F2;
            font-size: 0.4rem;
        }

        .time {
            float: right;
            margin-right: 2.5%;
            color: #7E85C2;
            font-size: .4rem;
        }

        .species {
            float: left;
            color: #BFC1F2;
            font-size: 0.3rem;
        }

        .species1 {
            float: right;
            color: #BFC1F2;
            font-size: 0.3rem;
            margin-left: 5px;
            font-size: .4rem;
        }

        img {
            width: 18%;
            vertical-align: bottom;
            margin-right: 10px;
        }
    </style>
</head>

<body>

    <div class="register_bg">
        <div class="home_zhangdui_nav">
            <span class="goBack"></span>
            <span>挑战记录</span>
        </div>

        <div class="record">
            <ul>

            </ul>
        </div>

    </div>
    <script src="../../js/public.js"></script>
    <script>
        let userId

        $.post(userInfoUrl, (res) => {
            console.log(res)
            let userInfo = res.obj
            userId = userInfo.fdId

        })
        $.post(pkRecordcUrl, res => {
            console.log(res)
            let obj = res.obj

            obj.forEach((item, index) => {
                let win =
                    ` <li>
                    <div class="headpiece">
                        <span class="roomNumber">房间号：</span><span class="number">${item.fdRoomNo}</span>
                      <span class="victor_sum"> <img src="../../images/home/icon_circle_victor.png" alt=""> +${item.fdAmount}<span class="species1"> 金币</span></span>
                    </div>
                    <div class="underpart" style="clear:both">
                        <span class="bottomPour">下注：</span><span class="BetAmount">${item.fdAmount} &nbsp</span><span class="time">${item.fdStartTime}</span>
                    </div>
                </li>`
                let lose =
                    `<li>
                            <div class="headpiece">
                                <span class="roomNumber">房间号：</span><span class="number">${item.fdRoomNo}</span>
                               <span class="lost_sum"><img src="../..//images/home/icon_circle_lost.png" alt="">-${item.fdAmount}<span class="species1"> 金币</span></span>
                            </div>
                            <div class="underpart" style="clear:both">
                                <span class="bottomPour">下注：</span><span class="BetAmount">${item.fdAmount} &nbsp</span><span class="species"> 金币</span><span class="time">${item.fdStartTime}</span>
                            </div>
                        </li>`
                if (item.fdCreateId == userId) {
                    if (item.fdResult == 1 || item.fdResult == -2) {

                        $('ul').append(win)
                    } else {

                        $('ul').append(lose)
                    }
                } else if (item.fdDareId == userId) {
                    if (item.fdResult == 2 || item.fdResult == -1) {

                        $('ul').append(win)

                    } else {

                        $('ul').append(lose)

                    }
                }



            });






        })

        // if (item.fdDareId == 'null') {
        //             let pk =
        //                 ` <li>
        //             <div class="headpiece">
        //                 <span class="roomNumber">房间号：</span><span class="number">${item.fdRoomNo}</span>
        //                 <span class="icon_circle_fighting"></span><span class="fighting_sum">+${item.fdAmount}</span><span class="fighting_species">金币</span>
        //             </div>
        //             <div class="underpart" style="clear:both">
        //                 <span class="bottomPour">下注：</span><span class="BetAmount">${item.fdAmount} &nbsp </span><span class="species"> 金币</span><span class="time">${item.fdStartTime}</span>
        //             </div>
        //         </li>`
        //             $('ul').append(pk)
        //         }
    </script>
</body>

</html>